<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form" %>  
<c:set var="ctx" value="${pageContext.request.contextPath}"/>

<html>
<head>
  <title>公司管理</title>
  <script>
    var selectIndustryModalInited = false;
    $(document).ready(function() {
      //聚焦第一个输入框
      $("#company_name").focus();
      //为inputForm注册validate函数
      $("#inputForm").validate();

      var names = [ '${company.industry.name}', '${company.industry2.name}' ];
      for (var i = names.length - 1; i >= 0; i--) {
        if (!names[i]) {
            names.splice(i);
        }
      }
      $('#company_industry_names').text(names.join('，'));

      $('#select_industry').click(function() {
        if (!selectIndustryModalInited) {
          $.get('${ctx}/helper/selectIndustryModal', function(html) {
            $('#select_industry_modal').html(html);
            callSelectIndustryModal();
            selectIndustryModalInited = true;
          });
        } else {
          callSelectIndustryModal();
        }
      });

      initProvinceCitySelect();
    });

    function callSelectIndustryModal() {
      SelectIndustryModal.init();
      $('#select_industry_modal').data('maxSelected', 2).data('selectedIds', [ $('#company_industryId').val(), $('#company_industry2Id').val() ]).data('callback', updateSelectedIndustries).modal('show');
    }

    function updateSelectedIndustries(selectedIndustries) {
      if (selectedIndustries) {
        var names = [];
        if (selectedIndustries.length > 0) {
          $('#company_industryId').val(selectedIndustries[0].id);
          names.push(selectedIndustries[0].name);
        } else {
          $('#company_industryId').val('');
        }
        if (selectedIndustries.length > 1) {
          $('#company_industry2Id').val(selectedIndustries[1].id);
          names.push(selectedIndustries[1].name);
        } else {
          $('#company_industry2Id').val('');
        }
        $('#company_industry_names').text(names.join('，'));
      }
    }

    function initProvinceCitySelect() {
      $('#company_province').change(function() {
        var container = $('#company_city_container');
        var cities = $('#company_city');
        cities.children('option[value!="0"]').appendTo(container);
        var number = container.children('[value^=' + $(this).val() + ']').appendTo(cities).length;
        if (number === 1) {
          cities.children().last().attr('selected', '');
        } else {
          cities.children().first().attr('selected', '');
        }
      }).change();
    }
  </script>
</head>

<body>
  <form:form id="inputForm" action="${ctx}/hr/option/company-profile" method="post" class="form-horizontal" commandName="company">
    <input type="hidden" name="id" value="${company.id}"/>
    <fieldset>
      <legend><small>基本信息</small></legend>
      <div class="control-group">
        <label for="company_name" class="control-label">公司名称:</label>
        <div class="controls">
          <input type="text" id="company_name" name="name" value="${company.name}" class="span8 required" minlength="3"/>
        </div>
      </div>
      <div class="control-group">
        <label for="company_briefName" class="control-label">公司简称:</label>
        <div class="controls">
          <input type="text" id="company_briefName" name="briefName" value="${company.briefName}" class="input-large"/>
        </div>
      </div>
      <div class="row">
        <div class="span5">
          <div class="control-group">
            <label for="company_size" class="control-label">公司规模:</label>
            <div class="controls">
              <select id="company_size" name="size" class="select-large">
              <c:forEach items="${companySizes}" var="companySize">
                <option value="${companySize.id}"<c:choose><c:when test="${company.size == companySize.id}"> selected</c:when></c:choose>>${companySize.name}</option>
              </c:forEach>
              </select>
            </div>
          </div>
        </div>
        <div class="span7">
          <div class="control-group">
            <label for="company_type" class="control-label">公司类型:</label>
            <div class="controls">
              <select id="company_type" name="type" class="select-large">
              <c:forEach items="${companyTypes}" var="companyType">
                <option value="${companyType.id}"<c:choose><c:when test="${company.type == companyType.id}"> selected</c:when></c:choose>>${companyType.name}</option>
              </c:forEach>
              </select>
            </div>
          </div>
        </div>
      </div>
      <div class="control-group">
        <label for="industry" class="control-label">所属行业:</label>
        <div class="controls">
          <span class="span5 uneditable-input" id="company_industry_names"></span>
          <input type="hidden" id="company_industryId" name="industryId" value="${company.industry.id}" />
          <input type="hidden" id="company_industry2Id" name="industry2Id" value="${company.industry2.id}" />
          <a id="select_industry" class="btn">选择</a>
        </div>
      </div>
      <div class="control-group">
        <label for="company_province" class="control-label">所属地区:</label>
        <div class="controls">
          <form:select id="company_province" path="province" class="span3">
            <option value="0">--- 请选择 ---</option>
            <form:options items="${companyProvinces}" itemLabel="name" itemValue="id" />
          </form:select>
          <select id="company_city" name="city" class="span3">
            <option value="0">--- 请选择 ---</option>
          </select>
          <form:select id="company_city_container" path="city" items="${companyCities}" itemLabel="name" itemValue="id" class="hide"/>
        </div>
      </div>
      <div class="control-group">
        <label for="company_address" class="control-label">地址:</label>
        <div class="controls">
          <input type="text" id="company_address" name="address" value="${company.address}" class="span8"/>
        </div>
      </div>
      <div class="row">
        <div class="span5">
          <div class="control-group">
            <label for="company_homepage" class="control-label">公司主页:</label>
            <div class="controls">
              <input type="text" id="company_homepage" name="homepage" value="${company.homepage}" class="input-large"/>
            </div>
          </div>
        </div>
        <div class="span7">
          <div class="control-group">
            <label for="company_homepage2" class="control-label">公司主页2:</label>
            <div class="controls">
              <input type="text" id="company_homepage2" name="homepage2" value="${company.homepage2}" class="input-large"/>
            </div>
          </div>
        </div>
      </div>
    </fieldset>
    <fieldset>
      <legend><small>联系信息</small></legend>
      <div class="row">
        <div class="span5">
          <div class="control-group">
            <label for="company_contactor" class="control-label">联系人:</label>
            <div class="controls">
              <input type="text" id="company_contactor" name="contactor" value="${company.contactor}" class="input-large"/>
            </div>
          </div>
        </div>
        <div class="span7">
          <div class="control-group">
            <label for="company_cellphone" class="control-label">手机:</label>
            <div class="controls">
              <input type="text" id="company_cellphone" name="cellphone" value="${company.cellphone}" class="input-large"/>
            </div>
          </div>
        </div>
      </div>
      <div class="row">
        <div class="span5">
          <div class="control-group">
            <label for="company_phone" class="control-label">电话:</label>
            <div class="controls">
              <input type="text" id="company_phone" name="phone" value="${company.phone}" class="input-large"/>
            </div>
          </div>
        </div>
        <div class="span7">
          <div class="control-group">
            <label for="company_fax" class="control-label">传真:</label>
            <div class="controls">
              <input type="text" id="company_fax" name="fax" value="${company.fax}" class="input-large"/>
            </div>
          </div>
        </div>
      </div>
      <div class="row">
        <div class="span5">
          <div class="control-group">
            <label for="company_email" class="control-label">Email:</label>
            <div class="controls">
              <input type="text" id="company_email" name="email" value="${company.email}" class="input-large"/>
            </div>
          </div>
        </div>
        <div class="span7">
          <div class="control-group">
            <label for="company_zipcode" class="control-label">邮编:</label>
            <div class="controls">
              <input type="text" id="company_zipcode" name="zipcode" value="${company.zipcode}" class="input-large"/>
            </div>
          </div>
        </div>
      </div>
    </fieldset>
    <fieldset>
      <legend><small>其他信息</small></legend>
      <div class="control-group">
        <label for="company_introduction" class="control-label">公司介绍:</label>
        <div class="controls">
          <textarea id="company_introduction" name="introduction" class="span8">${company.introduction}</textarea>
        </div>
      </div>
      <div class="form-actions">
        <input id="submit_btn" class="btn btn-primary" type="submit" value="提交"/>&nbsp;  
        <input id="cancel_btn" class="btn" type="button" value="返回" onclick="history.back()"/>
      </div>
    </fieldset>
  </form:form>
  <div id="select_industry_modal" class="modal hide fade"></div>
</body>
</html>
